import { useAppDispatch, useAppSelector } from "@/store/hooks";
import { submitWhiteAudit } from "@/store/whiteAudit/whiteAuditAPI";
import { getWhiteAuditAsync } from "@/store/whiteAudit/whiteAuditSlice";
import { List, Modal, Space, Tag } from "antd";
import type { ReactElement } from "react";

export default function Table(): ReactElement<typeof List, "div"> {
  const { table, params } = useAppSelector((state) => state.whiteAudit);
  const {
    config: { data: { data: { wd_review_whitelist = [] } = {} } = {} } = {},
  } = useAppSelector((state) => state.app);
  const dispatch = useAppDispatch();
  return (
    <List
      className="bg-white"
      loading={table.status === "loading"}
      dataSource={Object.keys(table.data?.data || {})}
      bordered
      size="small"
      renderItem={(item) => (
        <List.Item>
          <Space wrap size="small">
            {item}
            {Array.isArray(table.data?.data?.[item]) &&
              table.data.data[item].map((content) => {
                return (
                  content && (
                    <Tag
                      key={content}
                      color="#f50"
                      closable
                      onClose={(e) => {
                        e.preventDefault();
                        Modal.confirm({
                          title: '确认删除吗？',
                          onOk: () => new Promise<void>((resolve, reject) => {
                            submitWhiteAudit({
                              android_id: item,
                              app_params: "zxcvbn1",
                              params_type: 2,
                              model_name: content
                            }).then(() => {
                              resolve()
                              dispatch(getWhiteAuditAsync({...params}))
                            }).catch(reject)
                          })
                        })
                      }}
                    >
                      {
                        wd_review_whitelist?.find?.((i) => i.value === content)
                          ?.label
                      }
                    </Tag>
                  )
                );
              })}
          </Space>
        </List.Item>
      )}
    />
  );
}
